<template>
  <div>
    <NavBar>
      <template slot="content">
        <div>生日贺卡</div>
      </template>
      <template slot="right" v-if="isApp">
        <img
          src="./img/share3.png"
          class="record-detail-nav-right"
          @click="$refs.shareWx.show = true"
        />
      </template>
    </NavBar>
    <div class="content">
      <img :src="$route.query.birthdayImgUrl" alt="" />
    </div>
    <!-- <img src="./img/birthday.jpg" alt="" /> -->
    <ShareWx ref="shareWx" @handleShare="handleShare" />
  </div>
</template>
<script>
import NavBar from '@/components/h5header'
import ShareWx from '@/components/ShareWx'
import weixinShareImage from '@/services/h5/app-api/weixinShareImage.js'
import { isApp } from '@/utils/platform'
export default {
  components: { NavBar, ShareWx },
  data() {
    return {
      isApp
    }
  },
  created() {},
  methods: {
    handleShare(val) {
      weixinShareImage({
        shareType: val,
        imageUrl: this.$route.query.previewOrderImg
      })
    }
  }
}
</script>
<style scoped lang="less">
@media screen and (max-width: 538px) {
  .content {
    width: 100vw;
    height: calc(100vh - 38px);
    display: flex;
    justify-content: center;
    align-items: center;
    img {
      width: 100%;
    }
  }
}

@media screen and (min-width: 539px) {
  .content {
    width: 100vw;
    height: calc(100vh - 38px);
    display: flex;
    justify-content: center;
    align-items: center;
    img {
      height: 100%;
    }
  }
}
.record-detail-nav-right {
  width: 18px;
  height: 18px;
}
</style>
